Ext.onReady(function()
    {
    /*  HANDLERS    */
    var h_detalles = function(row){
        // carga los detalles en store
        X.get('detailStore').load({
            params:{
                idUsuario : row.get('idUsuario'),
                fecha: row.get('fecha')
            }
        });
        X.get('detailWindow').begin();
    }

    var h_liquidar = function(row){
        X.ajax({
            url     : '/liquidacion/ajax-cambiar-estado',
            // estado liquidado
            params  : {
                id: row.get('idUsuario'),
                estado: 'L'
            },
            afterSuccess : function(){
                X.get('listStore').reload();
            }
        });
    }

    var h_cancelar = function(row){
        X.ajax({
            url     : '/liquidacion/ajax-cambiar-estado',
            // se rechaza liquidación de profesor
            params  : {
                id: row.get('idUsuario'),
                estado: 'R'
            },
            afterSuccess : function(){
                X.get('listStore').reload();
            }
        });
    }


    /*  STORES  */
    X.store({
        id     : 'listStore',
        url    : '/liquidacion/ajax-listar',
        fields : ['idLiquidacion','fecha','responsable','importe','horas','idUsuario']
    });

    /*  GRID    */
    X.grid.panel({
        id       : 'listGrid',
        title    : 'Liquidaciones',
        renderTo : 'layout_content',
        height   : 526,
        width    : 935,
        storeId    : 'listStore',
        tbar : new Ext.Toolbar({
            items:[
            X.form.button({
                text:'Calcular liquidaciones',
                id:'listCalcular',
                icon:'/img/icon_agregar.png'
            }),

            {
                xtype: 'tbseparator',
                id:'listEspacio'
            }
            ]
        }),
        columns:[
        X.grid.date ({
            header: 'Fecha',
            dataIndex: 'fecha',
            width: 70
        }),
         X.grid.text ({
             header: 'Profesor',
             dataIndex: 'responsable',
             width: 250
         }),
        X.grid.text ({
            header: 'Importe',
            dataIndex: 'importe',
            align:'right',
            width: 110
        }),
        X.grid.text ({
            header: 'Horas',
            dataIndex: 'horas',
            align:'right',
            width: 60
        }),
        X.grid.show  ({
            align: 'center',
            header: 'Detalles',
            handler : h_detalles
        }),
        X.grid.ok  ({
            align: 'center',
            handler : h_liquidar
        }),
        X.grid.remove  ({
            align: 'center',
            handler : h_cancelar
        })],
        bbar : X.grid.paging({
            pageSize : 20,
            storeId  : 'listStore'
        })
    });
    X.event.button('listCalcular', function(){
         X.get('calcularWindow').begin();
    });
    X.win.panel({
        id       : 'listWindow',
        //title    : 'Carga de horario',
        modal    : false,
        resizable: false,
        border: false,
        items    : X.get('listGrid')
    });

    X.get('listWindow').show();
});
